<template>
  <div>
    

    <el-dialog
      title="学员列表"
      class="JADP-dialog JADP-dialog_center"
      :close-on-click-modal="false"
      :visible.sync="teacherVisible"
      v-loading="loading"
      lock-scroll
      width="70%"
      append-to-body
    >
      <div class="JADP-common-layout-center">
        <el-row class="JADP-common-search-box" :gutter="16">
          <el-form @submit.native.prevent>
            <!-- <el-col :span="6">
              <el-form-item label="班级名称">
                <el-input v-model="query.clazzname"></el-input>
              </el-form-item>
            </el-col> -->
            <el-col :span="6">
              <el-form-item label="用户名">
                <el-input
                  v-model="query.account"
                  placeholder="请输入用户名"
                  clearable
                >
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="姓名">
                <el-input
                  v-model="query.realname"
                  placeholder="请输入姓名"
                  clearable
                >
                </el-input>
              </el-form-item>
            </el-col>

            <el-col :span="6">
              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  @click="search()"
                  >查询</el-button
                >
                <el-button icon="el-icon-refresh-right" @click="reset()"
                  >重置</el-button
                >
              </el-form-item>
            </el-col>
          </el-form>
        </el-row>
        <div class="JADP-common-layout-main JADP-flex-main">
          <JADP-table
            v-loading="listLoading"
            :data="list"
            @sort-change="sortChange"
            highlight-current-row
            @current-change="handleSelectionChange"
          >
            <!-- <el-table-column prop="clazzname" label="班级名称" align="center" /> -->
            <el-table-column prop="account" label="用户名" align="center" />
            <el-table-column prop="realname" label="姓名" align="center" />
            <el-table-column prop="gender" label="性别" align="center">
              <template v-slot="{ row }">
                {{ getDict("sex", row.gender) }}
              </template>
            </el-table-column>
            <el-table-column
              prop="mobilephone"
              label="手机号码"
              align="center"
            />
            <el-table-column
              prop="certificatesnumber"
              label="身份证号码"
              width="150"
              align="center"
            />
            <el-table-column
              prop="title"
              label="职称"
              align="center"
            ></el-table-column>
            <el-table-column prop="education" label="学历" align="center">
              <template v-slot="{ row }">
                {{ getDict("Education", row.education) }}
              </template>
            </el-table-column>
            <el-table-column
              prop="company"
              label="工作单位"
              align="center"
              width="150"
            />
            <el-table-column prop="companytype" label="单位类型" align="center">
              <template v-slot="{ row }">
                {{ getDict("dwType", row.companytype) }}
              </template>
            </el-table-column>
          </JADP-table>
          <pagination
            :total="total"
            :page.sync="listQuery.currentPage"
            :limit.sync="listQuery.pageSize"
            @pagination="initData"
          />
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <!-- <el-button @click="teacherVisible = false">取 消</el-button> -->
        <el-button @click="stuTableE">取 消</el-button>

        <el-button type="primary" @click="determine">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import request from "@/utils/request";
export default {
  name: "stuTable",
  data() {
    return {
      teacherVisible: false,
      loading: false,
      listLoading: false,
      list: [],
      showAll: false,
      multipleSelection: [],
      total: 0,
      query: {
        account: undefined,
        realname: undefined,
        mobilephone: undefined,
        companytype: undefined,
        company: undefined,
        accountstatus: undefined
      },
      listQuery: {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      }
    };
  },
  // created() {
  //   this.initData();
  // },
  mounted() {
    // console.log("jinlai");
    this.initData();
  },
  methods: {
    //查询
    search() {
      this.listQuery = {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "creatortime"
      };
      this.initData();
    },
    //重置
    reset() {
      for (let key in this.query) {
        this.query[key] = undefined;
      }
      this.search();
    },
    // 取消
    stuTableE() {
      this.$emit("stuTableE", false);
    },
    // 确定
    determine() {
      this.$emit("determine", this.multipleSelection);
      this.$emit("stuTableE", false);

      // this.teacherVisible = false;
      // console.log(this.multipleSelection,"this.multipleSelection");
    },
    handleSelectionChange(val) {
      //   const res = val.map(item => item.id);
      this.multipleSelection = val;
    },
    sortChange({ column, prop, order }) {
      this.listQuery.sort = order == "ascending" ? "asc" : "desc";
      this.listQuery.sidx = !order ? "" : prop;
      this.initData();
    },
    initData() {
      this.listLoading = true;
      let _query = {
        ...this.listQuery,
        ...this.query,
        organizeId:this.$store.getters.organizeId
      };
      let query = {};
      for (let key in _query) {
        if (Array.isArray(_query[key])) {
          query[key] = _query[key].join();
        } else {
          query[key] = _query[key];
        }
      }
      request({
        // url: `/api/students/Xy_ks_students`,
        url: `api/students/Xy_ks_students/getStulist`,
        method: "get",
        data: query
      }).then(res => {
        console.log(res, "resresres");
        this.list = res.data.list;
        this.total = res.data.pagination.total;
        this.listLoading = false;
      });
    }
  }
};
</script>
<style scoped lang="scss">
.lala {
  width: 300px;
  height: 300px;
  background-color: pink;
}
</style>
